<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>OpenNebula Sunstone Login</title>
    <!--[if IE]><link rel="shortcut icon" href="images/favicon.svg"><![endif]-->
    <link rel="apple-touch-icon-precomposed" href="images/apple-touch-icon-precomposed.png">
    <link rel="icon" href="images/favicon.svg">
    <% if $conf[:env] == 'dev' %>
      <link href="css/app.css?v=<%= OpenNebula::VERSION %>" media="screen, projector, print" rel="stylesheet" type="text/css"></link>
      <script src="bower_components/requirejs/require.js" data-main="app/login"></script>
    <% else %>
      <link href="css/app.min.css?v=<%= OpenNebula::VERSION %>" media="screen, projector, print" rel="stylesheet" type="text/css"></link>
      <script src="dist/login.js"></script>
    <% end %>
  </head>

  <body id="login">
    <div id="wrapper">
      <div>
        <div class="row">
          <div class="columns small-6 small-centered small-offset-3 text-center">
            <div id="logo_sunstone" style="
              background: url(<%=$views_config.logo%>) no-repeat center;
              background-size: 100%;"></div>
          </div>
        </div>
        <form id="login_form" method="post" class="row">
          <% if (settings.config[:auth] == "x509") || (settings.config[:auth] == "remote") %>
            <%= erb :_login_x509 %>
          <% else %>
            <%= erb :_login_standard %>
          <% end %>
        </form>
        <div id="two_factor_auth" class="border" style="display: none;">
          <form id="two_factor_form" method="post" class="row">
            <div class="border columns small-6 small-centered small-offset-3 text-center" id="login">
              <div class="content">
                <div class="fieldset">
                  <label class="text-left">
                    Enter the six-digit code from your authenticator app
                    <input value="" type="text" maxlength="15" name="two_factor_auth_token" id="two_factor_auth_token" class="box"/>
                  </label>
                  <div class="row buttons small-collapse">
                    <div class="columns small-offset-6 small-6 text-right">
                      <button id="two_factor_auth_login_btn" type="button"></button>
                    </div>
                  </div>
                </div>
                <div id="webauthn_login_div">
                  <div class="text-center">
                    - or -
                  </div>
                  <div class="fieldset">
                    <div class="small-offset-2 small-8 text-center">
                      When you are ready to authenticate with your security key, press the button below.
                      <div class="row buttons small-collapse">
                        <div class="columns text-center">
                          <button id="webauthn_login_btn" type="button"></button>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </form>
        </div>
        <div class="small-offset-3 small-6 error-place">
          <div id="error_box" class="alert alert-box callout hidden secondary small" style="display: none">
            <span id="error_message"></span>
            <span id="auth_error"></span>
            <span id="one_error"></span>
          </div>
        </div>
      </div>
    </div>

    <div id="footer" style="overflow:visible;">
      <a href="http://opennebula.io" target="_blank" rel="nofollow noopener noreferrer">OpenNebula <%= OpenNebula::VERSION %></a>
    </div>
  </body>
</html>